.friend-list{
	width: 100%;
	height:494rpx;
	background-color:#ffffff;
	border-radius:24rpx;
	position: relative;
	margin-top: 56rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	.friend-list-title{
		height:44rpx;
		font-family:$global-font-family;
		font-weight:700;
		color:#333333;
		font-size:32rpx;
		margin-top: 48rpx;
	}
	.friend-count{
		display: flex;
		margin-top: 14rpx;
		.invited-count,.not-invited-count{
			width: 180rpx;
			text-align: center;
			height: 34rpx;
			line-height: 34rpx;
			.label{
				font-family:$global-font-family;
				color:#999999;
				font-size:24rpx;
			}
			.count{
				font-weight: 700;
				font-size:24rpx;
				color: #188cf1;
				margin-left: 10rpx;
			}
			.unit{
				color: #333333;
				font-weight: 700;
				font-size:26rpx;
			}
		}
		.invited-count{
			border-right: 1rpx #cccccc solid;
		}
	}
	.invited-firend-list{
		display: flex;
		justify-content: space-between;
		width: 438rpx;
		margin-top: 42rpx;
		.invited-firend-item{
			width: 110rpx;
			height: 118rpx;
			.invited-firend{
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content:space-between;
				height: 100%;
				.firend-avatar{
					width:80rpx;
					height:80rpx;
				}
				.firend-nickname{
					height:34rpx;
					line-height: 34rpx;
					font-family:$global-font-family;
					color:#999999;
					font-size:24rpx;
					width: 100%;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
					text-align: center;
				}
			}
			.add-btn{
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content:space-between;
				height: 100%;
				background-color: none;
				&::after{
					border: none;
					background-color: #ffffff;
				}
				.add-icon{
					width:80rpx;
					height:80rpx;
					border-radius: 50%;
					display: flex;
					align-items: center;
					justify-content: center;
					background-color: #e6e6e6;
					color: #999999;
					z-index: 10;
					.icon{
						font-size: 40rpx;
					}
				}
				.add-label{
					z-index: 10;
					height:32rpx;
					background-color:#ffe7c7;
					border-radius:18rpx;
					font-family:$global-font-family;
					color:#be6e04;
					font-size:20rpx;
					width:92rpx;
					line-height: 32rpx;
					text-align: center;
				}
			}
		}
	}
	.invitation-btn{
		margin-top: 48rpx;
		width:574rpx;
		height:100rpx;
		background-image:linear-gradient(128.63deg,#ffbf38 0%,#ff8000 100%);
		border-radius:24rpx;
		font-family:$global-font-family;
		color:#ffffff;
		font-size:32rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border: none !important;
		outline: none !important;
		&::after{
			border: none !important;
		}
		&.disabled{
			background-image:linear-gradient(to right,#cccccc,#cccccc);
		}
	}
}